<template>
  <div class="custom-style">
    <el-segmented
      v-model="nameValue"
      :options="options"
      direction="vertical"
      block
      @change="selectPathWay"
    >
      <template #default="scope">
        <div class="">
          <div>{{ scope.item.label }}</div>
        </div>
      </template>
    </el-segmented>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'
const nameValue = ref()
const options = [
  {
    label: '新建',
    value: 1
  },
  {
    label: '上传',
    value: 2
  },
  {
    label: '录制',
    value: 3
  }
]
const selectPathWay = (v: number) => {
  console.log(v)
  // if (v === 1) {
  //   drawPathToolbarEvent()
  // } else if (v === 2) {
  //   fileUploadToolbarEvent()
  // } else if (v === 3) {
  //   const record = useRecordStore()
  //   record.recordPathToolbarEvent()
  // }
}
</script>
<style scoped>
.custom-style .el-segmented {
  --el-segmented-item-selected-bg-color: none;
}
</style>
